<template>
  <div class="treeStyle">
    <el-input
      placeholder="输入配置关键字"
      v-model="filterText">
    </el-input>

    <el-tree
      @node-click="cliEvent"
      class="filter-tree men"
      :data="menuJson"
      :props="props"
      highlight-current
      empty-text="请选择配置空间"
      default-expand-all
      :filter-node-method="filterNode"
      ref="tree2">
    </el-tree>
  </div>
</template>

<style scoped="">
  .treeStyle {
    margin-right: 10px;
    margin-left: 10px;
    float: left;
    width: 280px;
  }

  .men {
    background-color: #F9FAFC;
  }
</style>

<script>
  import fetch from "../../store/uacc_api";
  import {mapState, mapMutations} from 'vuex';
  export default {
    data: function () {
      return {
        filterText: '',
        tree: '',
        props: {
          label: 'description',
          children: 'childNodes'
        }
      }
    },
    watch: {
      filterText(val) {
        this.$refs.tree2.filter(val);
      }
    },
    mounted: function () {
      this.queryNode();
    },
    computed: mapState(['menuJson']),
    methods: {
      ...mapMutations(['editTree', 'editMenu', 'editCurrentNode']),
      cliEvent(data) {
        this.editCurrentNode(data);
        this.$emit('clickMenu')
      },
      filterNode(value, data) {
        if (!value) return true;
        return data.description.indexOf(value) !== -1;
      },
      getCookie(c_name)
      {
        if (document.cookie.length > 0) {
          let c_start = document.cookie.indexOf(c_name + "=")
          if (c_start != -1) {
            c_start = c_start + c_name.length + 1
            let c_end = document.cookie.indexOf(";", c_start)
            if (c_end == -1) c_end = document.cookie.length
            return unescape(document.cookie.substring(c_start, c_end))
          }
        }
        return ""
      },
      queryNode(param){
        let me = this;
        fetch.queryNodes(param).then(function (resp) {
          if (resp.success) {
            let root = resp.data;
            me.editTree(root);
            let cookie = me.getCookie('SPACEID');
            let menu;
            if (cookie) {
              for (let item of root.childNodes) {
                if (item.id == cookie) {
                  menu = item;
                }
              }
              if (menu) {
                me.editMenu(JSON.parse('[' + JSON.stringify(menu) + ']'));
              }
            }
          } else {
            console.error(resp);
            me.$message({
              showClose: true,
              message: resp.errorMessage,
              type: 'error'
            })
          }
        });
      }
    }
  }
</script>
